<template>
    <vab-card shadow="always">
    <template #header>
        <span class="leve2_title">其它出库详情</span>
    </template>
    <el-table
        border
        height="290"
        style="width: 100%"
        :data="data.dataSource"
        v-loading="data.loading"
    >

            <el-table-column label="序号" align="center" width="80">
                <template #default="scope">
                    <span
                    v-text="(data.pageNum - 1) * data.pageSize + (scope.$index + 1)"
                    ></span>
                </template>
            </el-table-column>
            <el-table-column
                v-for="(item, i) in data.cloums"
                :key="i"
                :width="item.width"
                :prop="item.prop"
                :label="item.label"
                :align="item.type == 'money' || item.type == 'number' ? 'right' : 'center'"
            >
            <template #default="scope">
              <!-- 自定义 -->
              <div v-if="item.type == 'custom'">
                <span class="ellipsis" >
                  <el-tag v-if="scope.row[item.prop] == 1" class="ml-2" type="success">是</el-tag>
                  <el-tag v-if="scope.row[item.prop] == 2" class="ml-2" type="warning">否</el-tag>
                  <span v-if="scope.row[item.prop] == 0" class="ml-2" type="info">--</span>
                </span>
              </div>
              <!-- 正常 -->
              <div 
                v-else
                class="ellipsis"
              >
                {{ _FieldFormat(scope.row[item.prop], item.type) }}
              </div>
            </template>
            </el-table-column>
        </el-table>
    </vab-card>
  </template>
  
<script lang="ts" setup>
/**
 * @import
 */
import {
    OtherOutDetailCloums,
} from './tools'
import { FieldFormat } from '~/src/utils/utils'
import { getInventoryStockOutInfo } from '~/src/api/dms/inventory';
/**
 * @var
 */
const data = reactive<any>({
    dataSource: [],
    cloums: [],
    pageNum: 1,
    pageSize: 20,
    count: 0,
    search: {},
})
data.dataSource = []
data.cloums = OtherOutDetailCloums

/**
 * @method
 */
// 字段级格式化
const _FieldFormat = (value: string, type = '') => {
    return FieldFormat(value, type)
}
// 获取数据
const _GetDetailList = async (id: string | number) => {
    data.dataSource = []
    data.count = 0
    if (!id) return
    data.loading = true
    try {
        const res = await getInventoryStockOutInfo({ id })
        data.dataSource = res.data.list
        data.count = res.data.count
        data.loading = false
    } catch (error) { }
}
// 重置
const reset = () => {

}

defineExpose({
    requst: _GetDetailList,
})
</script>
  
<style lang="scss" scoped></style>
  